<template>
    <FormItem :label="`${itemData.label}：`" :prop="itemData.name" class="ivu-qwupload">
        <Upload ref="upload"
                name="myfile"
                :on-success="handleSuccess"
                :on-format-error="handleFormatError"
                :on-exceeded-size="handleMaxSize"
                :before-upload="handleBeforeUpload"
                :multiple="itemData.multiple"
                :format="itemData.format"
                :max-size="itemData.maxSize"
                :show-upload-list="itemData.showUploadList"
                :default-file-list="defaultList"
                action="/sysback/fileserver/upload">
            <Button icon="ios-cloud-upload-outline">文件上传</Button>
        </Upload>
    </FormItem>
</template>
<script>
    export default {
        props: {
            itemData: {
                type: Object
            },
            formData: {
                type: Object
            }
        },
        data () {
            return {
                defaultList: [],
                uploadList: [] // 上传文件列表
            }
        },
        watch: {

        },
        created () {},
        mounted () {
            if (this.formData.appApk) {
                this.defaultList.push(
                    { name: this.formData.appApk }
                )
            }
            this.$nextTick(() => {
                this.uploadList = this.$refs.upload.fileList;
            });
        },
        methods: {
            handleChange () {
                this.uploadList = this.$refs.upload.fileList;
                this.$emit('handleChangeFormData', this.formData);
            },
            // 上传成功
            handleSuccess (res, file, fileList) {
                if (file.response.retData) {
                    this.formData[this.itemData.name] = file.response.retData;
                }
                this.handleChange();
            },
            // 上传出错
            handleFormatError (file) {
                let fileType = this.itemData.format.join(',');
                this.$Notice.warning({
                    title: '文件格式不正确',
                    desc: '文件' + file.name + '格式不正确, 请选择' + fileType + '格式的文件.'
                });
            },
            // 上传最大限制
            handleMaxSize (file) {
                this.$Notice.warning({
                    title: '超出文件大小限制',
                    desc: '文件  ' + file.name + ' 太大了, 请确保文件在' + this.itemData.maxSize + 'kb以内.'
                });
            },
            // 上传前校验
            handleBeforeUpload () {
                this.isUping = true;
                let flag = true;
                const check = this.uploadList.length >= this.itemData.maxLen;
                if (check) {
                    this.$Notice.warning({
                        title: '上传文件达到最大限制.'
                    });
                    this.isUping = false;
                    flag = false;
                }
                return flag;
            }
        }
    }
</script>
<style lang="less" scoped>
.ivu-qwupload /deep/ .ivu-upload-list-file:hover .ivu-upload-list-remove{
	margin-top: 7px;
}
</style>
